var subject=[
	['请在以下九个字中选出正确诗句','草寸孤山谁四心烟言','谁言寸草心'],
	['请在以下十二个字中选出正确诗句','暗白处花家亮柳人深一有云','白云深处有人家'],
	['请在以下九个字中选出正确诗句','吹风举明盘头望又月','举头望明月'],
	['请在以下十二个字中选出正确诗句','爱处家晴柔深树水一阴有照','树阴照水爱晴柔'],
	['请在以下九个字中选出正确诗句','锄当禾尽落日山午依','锄禾日当午']//,
	// ['','',''],
	// ['','',''],
	// ['','',''],
	// ['','',''],
	// ['','','']
]
var sub=[0,0,0]//答题信息（已答题目,答对题目,答错题目）
var view_1=document.getElementById('view-1')//场景1--主页 
var view_2=document.getElementById('view-2')//场景2--答题界面
var view_3=document.getElementById('view-3')//场景3--结束界面(成功)
var view_4=document.getElementById('view-4')//场景4--结束页面(失败)
var table=document.getElementById('table')//包含选择按钮的表格
var tr=document.getElementById('other_tr')//12键选择按钮的最后3个的行
var btn=table.getElementsByClassName('btn')//每个选择按钮
var pick=view_2.getElementsByTagName('h4')[0]//显示选择的文字
var pass=view_3.getElementsByTagName('b')//显示答题情况(结束界面(成功))
var pass_btn=view_3.getElementsByTagName('button')//选择按钮(结束界面(成功))
var lose=view_4.getElementsByTagName('b')//显示答题情况(结束界面(失败))
var lose_btn=view_4.getElementsByTagName('button')//选择按钮(结束界面(失败))
var pick_text=''//通过选择按钮选择的文字

function start(){//定义start函数
	view_1.style.display='none'//主页隐藏
	view_2.style.display='block'//答题界面显示
	view_2.getElementsByTagName('h2')[0].innerHTML=subject[sub[0]][0]//显示每题的题目
	if(subject[sub[0]][1].length<12){//如果需要选择的文字小于12
		tr.style.display='none'//隐藏后3个选择按钮
	}
	for(var i=0;i<btn.length;i++){//循环每一个选择按钮
		btn[i].innerHTML=subject[sub[0]][1].slice(i,i+1)//把题库中需要选择的文字按需分割,并显示到每一个选择按钮
	}
}
function click(){//定义click函数
	if(pick.innerHTML.length==subject[sub[0]][2].length){//如果选择的文字的长度等于答案的文字的长度
		sub[0]+=1//已答题目加一
		// console.log(sub)//控制台输出答题情况
		if(pick.innerHTML==subject[sub[0]-1][2]){//如果选择的文字等于答案的文字
			sub[1]+=1//答对题目加一
			console.log(sub)//控制台输出答题情况
			if(sub[0]==subject.length){//如果已答题目等于题目数量
				if(sub[1]==subject.length){//如果答对题目等于题目数量
					pass[0].innerHTML=sub[0]//显示答题情况
					pass[1].innerHTML=sub[1]//显示答题情况
					pass[2].innerHTML=sub[0]-sub[1]//显示答题情况
					view_2.style.display='none'//答题界面隐藏
					view_3.style.display='block'//结束界面(成功)显示
				}
				else if(sub[1]!=subject.length){//否则如果答对题目不等于题目数量
					console.log('ok')//控制台输出ok
					lose[0].innerHTML=sub[0]//显示答题情况
					lose[1].innerHTML=sub[1]//显示答题情况
					lose[2].innerHTML=sub[0]-sub[1]//显示答题情况
					view_2.style.display='none'//答题界面隐藏
					view_4.style.display='block'//结束界面(失败)显示
				}
			}
		}
		else if(sub[0]==subject.length&&sub[1]!=subject.length){//否则如果已答题目等于题目数量且答对题目不等于题目数量
			console.log('ok')//控制台输出ok
			lose[0].innerHTML=sub[0]//显示答题情况
			lose[1].innerHTML=sub[1]//显示答题情况
			lose[2].innerHTML=sub[0]-sub[1]//显示答题情况
			view_2.style.display='none'//答题界面隐藏
			view_4.style.display='block'//结束界面(失败)显示
		}
		if(sub[0]<subject.length){//如果已答题目小于题目数量,那么显示下一题
			view_2.getElementsByTagName('h2')[0].innerHTML=subject[sub[0]][0]//显示每题的题目
			if(subject[sub[0]][1].length<12){//如果需要选择的文字小于12
				tr.style.display='none'//隐藏后3个选择按钮
			}
			else{//否则
				tr.style.display='table-row'//显示后3个选择按钮
			}
			for(var i=0;i<btn.length;i++){//循环每一个选择按钮
				btn[i].innerHTML=subject[sub[0]][1].slice(i,i+1)//把题库中需要选择的文字按需分割,并显示到每一个选择按钮
			}
			pick.innerHTML=''//清空通过选择按钮选择的文字
			for(var i=0;i<btn.length;i++){//循环每一个选择按钮
				btn[i].disabled=''//设置其按钮的状态为可用
			}
		}
	}
}
function back(Element){//定义back函数,back函数为有参函数,参数为Element
	Element.style.display='none'//隐藏(Element对象)
	view_1.style.display='block'//显示主页
}

view_1.getElementsByTagName('button')[0].onclick=function(){//当"开始游戏"按键按下
	start()//调用start函数
}

btn[0].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[0].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[0].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[1].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[1].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[1].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[2].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[2].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[2].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[3].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[3].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[3].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[4].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[4].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[4].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[5].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[5].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[5].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[6].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[6].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[6].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[7].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[7].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[7].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[8].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[8].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[8].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[9].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[9].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[9].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[10].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[10].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[10].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
btn[11].onclick=function(){//当选择按键按下
	this.disabled='disabled'//设置自己的状态为不可用
	pick.innerHTML=pick.innerHTML+btn[11].innerHTML//将通过选择按钮选择的文字加上自己显示的文字
	pick_text+=btn[11].innerHTML//将选择的文字的字符串变量加上自己显示的文字
	click()//调用click函数
}
pass_btn[0].onclick=function(){//当结束界面(成功)的“返回主页”键按下
	back(view_3)//调用back函数
}
pass_btn[1].onclick=function(){//当结束界面(成功)的“重新开始”键按下
	sub=[0,0,0]//重置答题信息数组
	view_3.style.display='none'//结束界面(成功)隐藏
	pick.innerHTML=''//清空通过选择按钮选择的文字
	for(var i=0;i<btn.length;i++){//循环每一个选择按钮
		btn[i].disabled=''//设置其按钮的状态为可用
	}
	start()//调用start函数
}
lose_btn[0].onclick=function(){//当结束界面(失败)的“返回主页”键按下
	back(view_4)//调用back函数
}
lose_btn[1].onclick=function(){
	sub=[0,0,0]//重置答题信息数组
	view_4.style.display='none'//结束界面(失败)隐藏
	pick.innerHTML=''//清空通过选择按钮选择的文字
	for(var i=0;i<btn.length;i++){//循环每一个选择按钮
		btn[i].disabled=''//设置其按钮的状态为可用
	}
	start()//调用start函数
}